<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta name="format-detection" content="telephone=no">
    <title>我的个人中心</title>
    <link rel="stylesheet" href="__CSS__/UserCenter/mydate.css">
    <link  type="text/css" href="__CSS__/UpImage/cropper.min.css" rel="stylesheet">
    <link  type="text/css" href="__CSS__/UpImage/main.css" rel="stylesheet">
    <script src="__JS__/jquery-2.0.0/jquery.min.js"></script>
    <script type="text/javascript" src="__JS__/UpImage/webuploader.html5only.min.js"></script>
    <script type="text/javascript" src="__JS__/UpImage/uploadImg.js"></script>
    <script type="text/javascript" src="__JS__/UpImage/diyUpload.js"></script>
    <script type="text/javascript" src="__JS__/layer/layer.js"></script>
    <script  type="text/javascript" src="__JS__/UpImage/bootstrap.min.js"></script>
    <script  type="text/javascript" src="__JS__/UpImage/cropper.min.js"></script>
    <script  type="text/javascript" src="__JS__/UpImage/main.js"></script>
</head>
<body class="mydata-body">
<!-- 个人中心详情页 -->
<div class="mydata-wrap">
    <!-- top -->
    <header class="g-header">
        <a class="Header-back" href="#"><i class="ico-back"></i></a><h1>个人信息</h1>
    </header>
    <!-- top -->
    <section class="mydata-infos">
        <div class="infos-list">
            <ul class="info-main">
                <!-- headpic -->
                <li class="header-pic">
                    <a class="i-list i-user-pic"  href="javascript:void(0);">头像
                      <span class="i-bar-txt">
                        <span class="i-user-avatar showUploadTx"><if condition="$userinfo.headpic neq ''" ><img id="head_img" src="{$userinfo.headpic}" alt="头像"><else/><img id="head_img" src="__IMG__/UserCenter/userlogo.jpg" alt="头像"></if><i class="ico-next"></i></span>
                      </span>
                    </a>
                    <!-- 更改头像表单 -->
                    <form  action="/Home/UserCenter/UserCenter/Upimgage" enctype="multipart/form-data" method="post" id="myform">
                        <input type="hidden" name ="up" value="" id="up">
                        <input type="hidden" name ="userid" value="{$userinfo.headpic}" id="userid">
                    </form>
                    <!-- 更改头像表单 -->
                <li>
                    <!-- headpic -->
                <li>
                    <a class="i-list" href="{:U('/Home/UserCenter/UserCenter/Mynickname',array('x'=>'nosecret','f'=>'json','nickname'=>$userinfo['nickname'],'id'=>$userinfo['id']))}">昵称
                        <span class="i-bar-txt">{$userinfo.nickname}<i class="ico-next"></i></span>
                    </a>
                </li>
                <li>
                    <a class="i-list" href="{:U('/Home/UserCenter/UserCenter/Myaddress',array('x'=>'nosecret','f'=>'json','id'=>$userinfo['id']))}">我的地址
                        <span class="i-bar-txt">{$userinfo.province}-{$userinfo.city}-{$userinfo.county}-{$userinfo.address_detail}<i class="ico-next"></i></span>
                    </a>
                </li>
                <li class="sub-bgcolor">
                    <a class="i-list" href="{:U('/Home/UserCenter/UserCenter/Mysex',array('x'=>'nosecret','f'=>'json','sex'=>$userinfo['sex'],'id'=>$userinfo['id']))}">性别
                        <span class="i-bar-txt">{$userinfo.sex}<i class="ico-next"></i></span>
                    </a>
                </li>
                <li>
                    <a class="i-list" href="{:U('/Home/UserCenter/UserCenter/Mybirdthday',array('x'=>'nosecret','f'=>'json','id'=>$userinfo['id']))}">生日
                        <span class="i-bar-txt">{$userinfo.birthday}<i class="ico-next"></i></span>
                    </a>
                </li>
                <li>
                    <a class="i-list" href="{:U('/Home/UserCenter/UserCenter/Mysignature',array('x'=>'nosecret','f'=>'json','signature'=>$userinfo['signature'],'id'=>$userinfo['id']))}">个性签名
                        <span class="i-bar-txt">{$userinfo.signature}<i class="ico-next"></i></span>
                    </a>
                </li>
            </ul>
        </div>
    </section>
    <section class="mydata-infos">
        <div class="infos-list">
            <ul class="info-main">
                <li>
                    <a class="i-list" href="{:U('/Home/UserCenter/UserCenter/Mynewmobile',array('x'=>'nosecret','f'=>'json','mobile'=>$userinfo['mobile'],'id'=>$userinfo['id']))}">修改手机号
                        <span class="i-bar-txt">{$userinfo.mobile}<i class="ico-next"></i></span>
                    </a>
                </li>
                <li>
                    <a class="i-list" href="{:U('/Home/UserCenter/UserCenter/Mypassword',array('x'=>'nosecret','f'=>'json','pass'=>$userinfo['mobile'],'id'=>$userinfo['id']))}">修改密码
                        <span class="i-bar-txt">******<i class="ico-next"></i></span>
                    </a>
                </li>
            </ul>
        </div>
    </section>
</div>
<div id="UploadTxBox" style="display: none;">
    <div class="container" id="crop-avatar">
        <!-- Cropping modal -->
        <div class="modal fade" id="avatar-modal" aria-hidden="true" aria-labelledby="avatar-modal-label" role="dialog"
             tabindex="-1">
            <div class="modal-dialog modal-lg">
                <div class="modal-content">
                    <form class="avatar-form" action="/Home/UserCenter/Imgcrop/cropwap" enctype="multipart/form-data" method="post">
                        <div class="UploadTxBox-modal-body">
                            <div class="avatar-body">
                                <!-- Upload image and data -->
                                <div class="avatar-upload">
                                    <input class="avatar-src" name="avatar_src" type="hidden">
                                    <input class="avatar-data" name="avatar_data" type="hidden">

                                    <p><label for="avatarInput" class="btn btn-red avatar-uploadbtn">选择本地图片<input
                                            class="avatar-input" id="avatarInput" name="avatar_file"
                                            type="file"></label></p>

                                    <p class="mt20 grey">支持JPG、JPEG、PNG格式、且大小不要超过2M</p>
                                    <input class="x" name="x" type="hidden">
                                    <input class="y" name="y" type="hidden">
                                    <input class="width" name="width" type="hidden">
                                    <input class="height" name="height" type="hidden">
                                </div>

                                <!-- Crop and preview -->
                                <div class="UploadTxBox-view">
                                    <div class="UploadTxBox-left">
                                        <div class="avatar-wrapper"></div>
                                    </div>
                                    <div class="UploadTxBox-right">
                                        <div class="avatar-preview preview-lg"></div>
                                        <div class="avatar-preview preview-md"></div>
                                    </div>
                                </div>
                                <div class="UploadTxBox-btnbox">
                                    <button class="btn btn-red"  type="submit" id="submit_crop">提交</button>
                                    <button class="btn btn-white mlt10 closeDialogbtn" type="button">取消</button>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <div class="loading" aria-label="Loading" role="img" tabindex="-1"></div>
</div>
<script>
    $(function () {
        //上传头像
        $(".showUploadTx").click(function () {
            layer.open({
                type: 1,
                skin: 'layui-layer-yuan', //样式类名
                closeBtn: 1, //不显示关闭按钮
                shadeClose: true, //开启遮罩关闭
                shade: [0.5],
                area: '680px',
                title: "上传头像",
                content: $('#UploadTxBox')
            });
        });
        $(".closeDialogbtn").click(function () {
            layer.closeAll();
        })
    })
</script>

</body>
</html>
